import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import { resolve } from 'path'
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
import ElementPlus from 'unplugin-element-plus/vite'
import Icons from 'unplugin-icons/vite'
import { viteStaticCopy } from 'vite-plugin-static-copy'
import IconsResolver from 'unplugin-icons/resolver'
import UnoCSS from 'unocss/vite'
import VueSetupExtend from 'vite-plugin-vue-setup-extend'
import libCss from 'vite-plugin-libcss'
import vueJsx from '@vitejs/plugin-vue-jsx'
import pkg from './package.json'

// https://vitejs.dev/config/
export default defineConfig({
  build: {
    outDir: 'nstd-components-pc-v3',
    cssCodeSplit: true,
    emptyOutDir: true,
    lib: {
      entry: resolve(__dirname, 'src/packages/index.js'),
      name: 'nstd-components-pc-v3',
      fileName: 'nstd-components-pc-v3',
      formats: ['es', 'cjs', 'umd'],
    },
    rollupOptions: {
      // 确保外部化处理那些你不想打包进库的依赖
      external: ['vue',...Object.keys(pkg.dependencies)],
      output: {
        // 在 UMD 构建模式下为这些外部化的依赖提供一个全局变量
        globals: {
          vue: 'Vue',
        },
      },
    },
  },
  resolve: {
    alias: {
      '@': resolve(__dirname, './src'),
    },
    extensions: ['.js', '.json', '.ts'], // 导入时想要省略的后缀名，.vue等自定义文件不建议省略，影响IDE识别和提示
  },
  // 修改element主题色
  css: {
    preprocessorOptions: {
      scss: {
        additionalData: `@use "@/assets/element/theme-green.scss" as *;`,
      },
    },
  },
  plugins: [
    viteStaticCopy({
      targets: [
        {
          src: './node_modules/element-plus/es/constants/',
          dest: '',
        },
        {
          src: './node_modules/element-plus/es/directives/',
          dest: '',
        },
        {
          src: './node_modules/element-plus/es/hooks/',
          dest: '',
        },
        {
          src: './node_modules/element-plus/es/locale/',
          dest: '',
        },
        {
          src: './node_modules/element-plus/es/utils/',
          dest: '',
        },
      ],
    }),
    vue(),
    vueJsx(),
    UnoCSS(),
    libCss(),
    AutoImport({
      imports: ['vue', 'vue-router'],
      vueTemplate: true,
      eslintrc: {
        enabled: true,
        filepath: './.eslintrc-auto-import.json',
        globalsPropValue: true,
      },
      dts: false,
      resolvers: [
        // 自动导入 Element Plus 相关函数，如：ElMessage, ElMessageBox... (带样式)
        ElementPlusResolver({
          importStyle: 'sass',
        }),
        // 自动解析 ElementPlus 图标组件
        IconsResolver({
          prefix: 'i',
          enabledCollections: ['ep'],
        }),
      ],
    }),
    Components({
      // 要搜索组件的目录的相对路径。默认 ['src/components']
      dirs: ['src'],
      // 搜索子目录
      deep: true,
      dts: false,
      resolvers: [
        // 自动导入 Element Plus 组件
        ElementPlusResolver({
          importStyle: 'sass',
        }),
        // 自动注册图标组件
        IconsResolver({
          enabledCollections: ['ep'],
        }),
      ],
    }),
    ElementPlus({
      importStyle: 'sass',
      useSource: true,
    }),
    Icons({
      // 自动安装图标集
      autoInstall: true,
    }),
    VueSetupExtend()
  ],
  server: {
    host: true,
    port: 5173,
    proxy: {
      '/api': {
        // target: 'http://10.0.0.60:18080/',
        target: 'http://192.168.1.11:18080',
        ws: false,
        changeOrigin: true
      },
    }
  }
})
